<template>
  <div class="private">
    <div class="text">我的消息</div>
    <el-tabs type="border-card" class="demo-tabs" stretch>
      <el-tab-pane label="私信"
        ><PrivateMsg :data="data" :textclick="colclick" />
      </el-tab-pane>
      <el-tab-pane label="交友私信">
        <PrivateMsg :data="friendmsg" :textclick="colclick" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script >
import { defineComponent, computed } from "vue";
import { useStore } from "vuex";

import PrivateMsg from "./cpns/PrivateMsg.vue";

import { colclick } from "../zzydialog/utils";

export default defineComponent({
  components: { PrivateMsg },
  setup() {
    const store = useStore();
    const data = computed(() => store.state.head.data);
    const friendmsg = computed(() => store.state.head.friendmsg);
    console.log(data.value, "data值");
    console.log(friendmsg, "xiaozhang");
    return { data, colclick, friendmsg };
  },
});
</script>

<style scoped lang="less" >
.private {
  .text {
    height: 36px;
    line-height: 36px;
    font-size: 20px;
    text-align: center;
  }

  /deep/.el-tabs__content {
    padding: 10px 0 10px 0;
  }
}
</style>
